<template>
  <div>
    <span>{{select_name}}</span>
    <select v-model="game_selected">
      <option v-for="(v,k) in list" :key="k" :value="parseInt(v.type)?v.type:v.id">{{v.name}}</option>
    </select>

    <!--<select v-model="game_selected">-->
      <!--<slot></slot>-->
    <!--</select>-->
  </div>
</template>
<script>
    export default {
        name: "selectComponent",
       data(){
          return{
            game_selected:''
          }
       },
       props:['list','select_name','type','_selected'],
       created(){
          this.game_selected=this._selected;
       },
       mounted(){
         // if(this.list.length>0){
         //   this.game_selected=parseInt(this.list[0].type)?this.list[0].type:this.list[0].id;
         // }
         console.warn('select--------------')
       },
      activated(){
        console.warn('select--------activated------')
      },
      watch:{
        _selected:function(){
          this.game_selected=this._selected;
        },
        game_selected:function(){
          this.$emit('game_selected',{game:this.game_selected,type:this.type});
          // this.$root.$emit('game_selected',{game:this.game_selected,type:this.type});
        }
      }
    }
</script>

<style scoped lang="scss">
  div{
    display: inline;
  }
  select{
    width: 100px;
    padding:2px 5px;
    border-radius: 5px;
    margin-right: 5px;
  }
</style>
